import { IEventProps, Event } from '@/shared'
import { ISchema } from '@formily/json-schema'
import {
  Engine,
  ITreeNode,
  ScreenType,
  Shortcut,
  Viewport,
  Workbench,
  Workspace,
  TreeNode,
} from './models'

export type IDesignerIconStore = Record<string, any>

export interface IDesignerLocales {
  [ISOCode: string]: {
    [key: string]: any
  }
}
export interface IDesignerStore<P> {
  value: P
}

export type IDesignerBehaviorStore = IDesignerStore<IBehavior[]>

export interface IBehavior {
  name: string
  extends?: string[]
  selector: (node: TreeNode) => boolean
  designerProps?: IDesignerControllerProps
  designerLocales?: IDesignerLocales
}

export type IDesignerAppTheme = 'light' | 'dark'

// 描边连接类型
export type StrokeLinejoin = 'miter' | 'round' | 'bevel'

// 描边端点类型
export type StrokeLinecap = 'butt' | 'round' | 'square'

// 主题
export type IconTheme = 'outline' | 'filled' | 'two-tone' | 'multi-color'

// 全文默认配置
export interface IDesignerAppConfig extends Required<IIconBase> {
  appTheme: IDesignerAppTheme
  prefixCls: string
  fontColor: string
  followSystem: boolean
  rtl: boolean //// RTL是否开启
  iconColor: {
    outline: {
      fill: string
      background: string
    }
    filled: {
      fill: string
      background: string
    }
    twoTone: {
      fill: string
      twoTone: string
    }
    multiColor: {
      outStrokeColor: string
      outFillColor: string
      innerStrokeColor: string
      innerFillColor: string
    }
  }
}

// 图标基础属性
export interface IIconBase {
  // 图标尺寸大小，默认1em
  iconSize?: number | string
  // 描边宽度
  strokeWidth?: number
  // 描边端点类型
  strokeLinecap?: StrokeLinecap
  // 描边连接线类型
  strokeLinejoin?: StrokeLinejoin
  // 默认主题
  iconTheme?: IconTheme
  // 填充色
  iconFill?: string | string[]
}

// 包裹前的图标属性
export interface ISvgIconProps
  extends Required<Omit<IIconBase, 'iconTheme' | 'iconFill'>> {
  // 当前图标的唯一Id
  id: string
  // 换肤的颜色数组
  colors: string[]
}

export type IEngineProps<T = Event> = IEventProps<T> & {
  shortcuts?: Shortcut[]
  sourceIdAttrName?: string //拖拽源Id的dom属性名
  nodeIdAttrName?: string //节点Id的dom属性名
  contentEditableAttrName?: string //原地编辑属性名
  contentEditableNodeIdAttrName?: string //原地编辑指定Node Id属性名
  clickStopPropagationAttrName?: string //点击阻止冒泡属性
  outlineNodeIdAttrName?: string //大纲树节点ID的dom属性名
  nodeHelpersIdAttrName?: string //节点工具栏属性名
  defaultComponentTree?: ITreeNode //默认组件树
  defaultScreenType?: ScreenType
  rootComponentName?: string
}

export type IEngineContext = {
  workspace: Workspace
  workbench: Workbench
  engine: Engine
  viewport: Viewport
}

export interface IDesignerProps {
  package?: string //npm包名
  registry?: string //web npm注册平台地址
  version?: string //semever版本号
  path?: string //组件模块路径
  title?: string //标题
  description?: string //描述
  icon?: string //icon
  droppable?: boolean //是否可作为拖拽容器，默认为true
  draggable?: boolean //是否可拖拽，默认为true
  deletable?: boolean //是否可删除，默认为true
  cloneable?: boolean //是否可拷贝，默认为true
  resizable?: boolean //是否可修改尺寸，默认为false
  inlineChildrenLayout?: boolean //子节点内联，用于指定复杂布局容器，强制内联
  selfRenderChildren?: boolean //是否自己渲染子节点
  propsSchema?: ISchema //Formily JSON Schema
  defaultProps?: any //默认属性
  getDragNodes?: (node: TreeNode) => TreeNode | TreeNode[] //拦截转换Drag节点
  getDropNodes?: (node: TreeNode, parent: TreeNode) => TreeNode | TreeNode[] //拦截转换Drop节点
  getComponentProps?: (node: TreeNode) => any //拦截属性
  allowAppend?: (target: TreeNode, sources?: TreeNode[]) => boolean
  allowSiblings?: (target: TreeNode, sources?: TreeNode[]) => boolean
  allowDrop?: (target: TreeNode) => boolean
  [key: string]: any
}

export type IDesignerControllerProps =
  | IDesignerProps
  | ((node: TreeNode) => IDesignerProps)

export type WorkbenchTypes =
  | 'DESIGNABLE'
  | 'PREVIEW'
  | 'JSONTREE'
  | 'MARKUP'
  | (string & Record<string, any>)

export type IBehaviorLike = IBehavior[] | IBehaviorHost

export interface IBehaviorHost {
  Behavior?: IBehavior[]
}

export interface IDesignerMiniLocales {
  [ISOCode: string]: string
}

export interface IResource {
  title?: string | IDesignerMiniLocales
  description?: string | IDesignerMiniLocales
  icon?: any
  thumb?: string
  span?: number
  node?: TreeNode
}

export interface IResourceCreator {
  title?: string | IDesignerMiniLocales
  description?: string | IDesignerMiniLocales
  icon?: any
  thumb?: string
  span?: number
  elements?: ITreeNode[]
}

export type IResourceLike = IResource[] | IResourceHost

export interface IResourceHost {
  Resource?: IResource[]
}
